<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="color.css" />
    <title>Document</title>
  </head>
  <body  >
    <div>
      <img src="https://img1.imgtp.com/2023/02/16/dRdOCJZB.jpg" />

      <div class="subject">
        <p id="title" class="title">GRD-LAMP</p>
        <div class="Mode">
          <p class="select-pattern">选择模式：</p>

          <but1 id="but1" class="but1">流动彩虹</but1>
          <but2 id="but2">全彩变化</but2>
          <but3 id="but3">呼吸灯</but3>
          <but4 id="but4">暖光灯</but4>
          <but5 id="but5">冷光灯</but5>
          <but6 id="but6">追光灯1</but6>
          <but7 id="but7">追光灯2</but7>
          <but8 id="but8">追光灯3</but8>
        </div>
        <div class="set-brightness">
          <p id="passage1" class="passage1">选择颜色：(请点击下面颜色之后再滑动滑块）</p>
          <input
            type="range"
            class="brightness"
            id="hue"
            max="360"
            min="0"
            value="0"
          />
          <span id="span" class="span">H:0</span>

          <svg>
            <linearGradient
              id="gradient-hsv"
              x1="0%"
              y1="10%"
              x2="90%"
              y2="10%"
            >
              <stop offset="0%" stop-color="#000000" stop-opacity="1"></stop>
              <stop offset="1%" stop-color="#FF0000" stop-opacity="1"></stop>
              <stop offset="13%" stop-color="#FF5500" stop-opacity="1"></stop>
              <stop offset="25%" stop-color="#80FF00" stop-opacity="1"></stop>
              <stop offset="38%" stop-color="#00FF44" stop-opacity="1"></stop>
              <stop offset="50%" stop-color="#00FFFF" stop-opacity="1"></stop>
              <stop offset="63%" stop-color="#003CFF" stop-opacity="1"></stop>
              <stop offset="75%" stop-color="#8000FF" stop-opacity="1"></stop>
              <stop offset="88%" stop-color="#FF00BB" stop-opacity="1"></stop>
              <stop offset="95%" stop-color="#FF004C" stop-opacity="1"></stop>
              <stop offset="100%" stop-color="#FFFFFF" stop-opacity="0"></stop>
            </linearGradient>
            <rect
              x="0"
              y="0"
              width="100%"
              height="10%"
              fill="url(#gradient-hsv)"
            ></rect>
          </svg>
          <div class="color0"></div>

          <div class="color1" id="color1"></div>
          <div class="color2" id="color2"></div>
          <div class="color3" id="color3"></div>
          <p class="p1" id="p1">颜色1</p>
          <p class="p2" id="p2">颜色2</p>
          <p class="p3"id="p3">颜色3</p>
          
        <div class="wifi">
          <a href="./WIFI_Setting/wifi.html"    class="wa" >WiFi 配网</a>

        </div>
          
          </div>


        <div class="slipNav">
          <nav>
            <a href="./login.html"
              ><img
                id="main"
                class="main_page"
                src="https://img1.imgtp.com/2023/06/07/vMeUuYrI.png"
            /></a>
            <a
              ><img
                id="else"
                class="else_page"
                src="https://img1.imgtp.com/2023/06/07/riC9d1ja.png"
            /></a>
            <div class="select-line" id="select-line"></div>
          </nav>
          <!-- 底部线条 -->
          <div class="line"></div>
        </div>
      </div>
    </div>
    <script src="./color.js"></script>

    <script></script>
  </body>
</html>
